<template>
  <div class="custom-button">
    <a v-if="!showPop" :class="['a-' + type]" @click="$emit('click')">
      <slot>新增</slot>
    </a>
    <a-popconfirm
      v-else
      v-bind="$attrs"
      :title="tipMsg"
      :ok-text="okText"
      :cancel-text="cancelText"
      placement="bottom"
      @confirm="confirm"
      @cancel="cancel"
    >
      <a class="a-danger">
        <slot>删除</slot>
      </a>
    </a-popconfirm>
  </div>
</template>

<script>
export default {
  name: "VA",
  props: {
    // primary success danger info warning
    type: {
      type: String,
      default: "primary",
    },
    tipMsg: {
      type: String,
      default: "是否删除改条数据?",
    },
    okText: {
      type: String,
      default: "是",
    },
    cancelText: {
      type: String,
      default: "否",
    },
  },
  computed: {
    showPop() {
      return ["danger"].includes(this.type);
    },
  },
  methods: {
    confirm(e) {
     this.$emit('click')
    },
    cancel() {

    },
  },
};
</script>

<style lang="less" scoped>
.custom-button {
    display: inline-block;
    margin-right: 10px;
  .a-primary {
    color: #2b90fe;
  }
  .a-success {
    color: #65c13b;
  }
  .a-info {
    color: #909399;
  }
  .a-warning {
    color: #e5a33f;
  }
  .a-danger {
    color: #f46f6d;
  }
}
</style>
